<template>
  <el-dialog
    :title="title"
    :visible.sync="open"
    width="70%"
    :before-close="handleClose"
    class="dialogClass"
  >
    <el-form ref="ruleForm" :model="ruleForm" label-width="80px">
      <el-row :gutter="20">
        <el-col :xl="6" :lg="8">
          <el-form-item label="管理号" prop="guanlihao">
            <el-input
              size="big"
              v-model="ruleForm.guanlihao"
              placeholder="请输入管理号"
              clearable
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xl="6" :lg="8">
          <el-form-item label="牛号" prop="niuhao">
            <el-input
              size="big"
              v-model="ruleForm.niuhao"
              placeholder="请输入牛号"
              clearable
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xl="6" :lg="8">
          <el-form-item label="牛场" prop="niuchang">
            <el-input
              size="big"
              v-model="ruleForm.niuchang"
              placeholder="请输入牛场"
              clearable
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xl="6" :lg="8">
          <el-form-item label="胎次" prop="taici">
            <el-input
              size="big"
              v-model="ruleForm.taici"
              placeholder="请输入胎次"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xl="6" :lg="8">
          <el-form-item label="配种日期" prop="peizhong">
            <el-input
              size="big"
              v-model="ruleForm.peizhong"
              placeholder="请输入配种日期"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xl="6" :lg="8">
          <el-form-item label="发情日期" prop="faqingriqi">
            <el-input
              size="big"
              v-model="ruleForm.faqingriqi"
              placeholder="请输入发情日期"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xl="6" :lg="8">
          <el-form-item label="发情类别" prop="faqingleib">
            <el-input
              size="big"
              v-model="ruleForm.faqingleib"
              placeholder="请输入发情类别"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xl="6" :lg="8">
          <el-form-item label="发现人" prop="faxianren">
            <el-input
              size="big"
              v-model="ruleForm.faxianren"
              placeholder="请输入发现人"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xl="6" :lg="8">
          <el-form-item label="是否配种" prop="shifoupeizhong">
            <el-input
              size="big"
              v-model="ruleForm.shifoupeizhong"
              placeholder="请输入是否配种"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xl="6" :lg="8">
          <el-form-item label="公牛号" prop="gongniuhao">
            <el-input
              size="big"
              v-model="ruleForm.gongniuhao"
              placeholder="请输入公牛号"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xl="6" :lg="8">
          <el-form-item label="冻精号" prop="dongjinghao">
            <el-input
              size="big"
              v-model="ruleForm.dongjinghao"
              placeholder="请输入冻精号"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xl="6" :lg="8">
          <el-form-item label="是否性控" prop="shifouxingkong">
            <el-input
              size="big"
              v-model="ruleForm.shifouxingkong"
              placeholder="请输入是否性控"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xl="6" :lg="8">
          <el-form-item label="配种员" prop="peizhhongyuan">
            <el-input
              size="big"
              v-model="ruleForm.peizhhongyuan"
              placeholder="请输入配种员"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xl="6" :lg="8">
          <el-form-item label="配种时分娩天数" prop="peizhongshi" label-width="120px">
            <el-input
              size="big"
              v-model="ruleForm.peizhongshi"
              placeholder="请输入配种时分娩天数"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xl="6" :lg="8">
          <el-form-item label="上次繁殖状态" prop="shangcifanzhi" label-width="100px">
            <el-input
              size="big"
              v-model="ruleForm.shangcifanzhi"
              placeholder="请输入上次繁殖状态"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button
        type="primary"
        size="big"
        @click="onSubmit('ruleForm')"
        :loading="loading"
        >{{ submitButton }}</el-button
      >
      <el-button size="big" @click="resetForm('ruleForm')">重置</el-button>
      <el-button size="big" @click="close('ruleForm')">取消</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { savedelegate, updatedelegate } from "@/apis/store/delegate.js";

export default {
  name: "addCategory",
  data() {
    return {
      // 提交按钮
      submitButton: "",
      // 控制弹窗
      open: false,
      // 控制按钮加载状态
      loading: false,
      // 弹窗标题
      title: "",
      // 当前库房
      // 表单项
      ruleForm: {
        niuchang: "",
        faqingriqi: "",
        peizhhongyuan: "",
        peizhong: "",
        faqingleib: "",
        niuhao: "",
        taici: "",
        gongniuhao: "",
        shangcifanzhi: "",
        dongjinghao: "",
        peizhongshi: "",
        guanlihao: "",
        shifouxingkong: "",
        faxianren: "",
        shifoupeizhong: "",
      },
    };
  },
  methods: {
    // 控制弹窗
    show(title, row) {
      const _this = this;
      _this.title = title;
      _this.open = true;
      if (row) {
        _this.submitButton = "修改";
        _this.ruleForm = JSON.parse(JSON.stringify(row));
      } else {
        _this.submitButton = "确定";
      }
    },
    //关闭
    close(formName) {
      this.open = false;
      this.resetForm(formName);
    },
    //点击关闭
    handleClose(done) {
      const _this = this;
      _this
        .$confirm("系统可能不会保存您的更改", "确认关闭？")
        .then((_) => {
          done();
          _this.resetForm("ruleForm");
        })
        .catch((_) => {});
    },
    //点击提交
    onSubmit(formName) {
      const _this = this;
      this.$refs[formName].validate((valid) => {
        if (valid) {
          if (_this.title == "创建繁育信息") {
            savedelegate(_this.ruleForm).then(function (res) {
              if (res.code === 0) {
                _this.$alert(_this.ruleForm.guanlihao + res.msg, "提示", {
                  confirmButtonText: "确定",
                  callback: (action) => {
                    _this.close("ruleForm");
                    _this.$parent.$parent.search();
                  },
                });
              }
            });
          } else {
            updatedelegate(_this.ruleForm).then(function (res) {
              if (res.code === 0) {
                _this.$alert(_this.ruleForm.guanlihao + res.msg, "提示", {
                  confirmButtonText: "确定",
                  callback: (action) => {
                    _this.close("ruleForm");
                    _this.$parent.$parent.search();
                  },
                });
              }
            });
          }
        }
      });
    },
    // 表单重置
    resetForm(formName) {
      this.$refs[formName].resetFields();
    },
  },
};
</script>

<style scoped>
</style>